@charset "UTF-8";
/**
 * var.scss 变量
 * @author Kayo&Clearwu
 * @date 2015-08-17
 *
 * --- common ----
 * #common 通用
 *
 * --- component ----
 * #button 按钮组件
 * #dialog 对话框组件
 * #mask 遮罩层组件
 * #dropdownMenu 下拉菜单组件
 * #tab 选项卡组件
 * #inputText、#textarea 文本输入组件
 *
 * --- project ---
 * #frame 外层框架
 * #others 其它组件
 * #column 栏目，用于展示组件及其介绍
 * #index 首页
 */

// 计算的工具方法
@import "../qmui_web/qmui/mixin/tool/_calculate";

// #common 通用
$common_fontFamily: "Helvetica Neue", "Arial", "PingFang SC", "Hiragino Sans GB", "STHeiti", "Microsoft YaHei", sans-serif;
$common_fontSize: 14px;
$common_body_background: #FFF;
$common_body_color: #474860;
$common_color_link: #00A3E1;
$common_color_linkTapHighlight: rgba(105, 186, 255, .13);
$common_color_lightGray: #9595A3;
$common_color_black: #333;
$common_color_gray: #787878;
$common_color_darkGray: #555557;
$common_color_separator: #D4D6D8;
$common_color_border: #DEE0E2;
$common_color_placeholder: #ADB4BE;
$common_color_placeholderFocus: $common_color_placeholder;
$common_color_code_background: #FAF8F2;
$common_color_code_borderColor: #e4dcc5;
$common_zIndex_1: 10;
$common_zIndex_2: 20;
$common_zIndex_3: 30;
$common_zIndex_4: 40;
$common_zIndex_5: 50;
$common_zIndex_6: 60;
$common_zIndex_7: 70;
$common_zIndex_8: 80;
$common_zIndex_9: 90;
$common_zIndex_10: 100;


// #button 按钮组件
$btn_minWidth: 46px;
$btn_height: 30px;
$btn_lineHeight: $btn_height;
$btn_padding: 0 12px;
$btn_background: #04C9E8;
$btn_border: 1px solid transparent;
$btn_fontSize: 13px;
$btn_color: #FFF;

// #dialog 对话框组件
$dialog_zIndex: $common_zIndex_10;
$dialog_minWidth: 420px; // 对话框的最小宽度
$dialog_background: #FFF;
$dialog_border: none;
$dialog_radius: 5px;

$dialog_head_background: #00C0E1;
$dialog_head_borderBottom: none; // 对话框头部的下边线

$dialog_title_height: 40px;
$dialog_title_fontSize: 14px;
$dialog_title_fontWeight: bold;
$dialog_title_color: #FFF;
$dialog_title_lineHeight: $dialog_title_height;

$dialog_close_top: 5px;
$dialog_close_right: 6px;

$dialog_body_background: #FFF;

$dialog_foot_background: $dialog_background; // 对话框底部的背景，默认与对话框的背景一样
$dialog_foot_borderTop: $dialog_head_borderBottom; // 对话框底部的上边线，样式默认与对话框边线一样


// #mask 遮罩层组件
$mask_zIndex: $common_zIndex_9;
$maskWrap_zIndex: $mask_zIndex;
$mask_background: #000;
$mask_opacity: .5;


// #dropdownMenu 下拉菜单组件
$dropdownMenu_zIndex: $common_zIndex_3;
$dropdownMenu_background: #FFF;
$dropdownMenu_border: 1px solid $common_color_border;
$dropdownMenu_ulPadding: 12px 0;
$dropdownMenu_itemLink_height: 32px;
$dropdownMenu_itemLink_lineHeight: $dropdownMenu_itemLink_height;
$dropdownMenu_itemLink_padding: 0 15px;
$dropdownMenu_itemLink_color:  #000;
$dropdownMenu_split_margin: 5px 0;
$dropdownMenu_split_borderTop: 1px solid #ccc;


// #tab 选项卡组件
$tab_background: #FFF;
$tab_head_background: $tab_background;
$tabNav_padding: 0 16px;
$tabNav_item_margin: 0 24px -1px 0;
$tabNav_itemLink_height: 43px;
$tabNav_itemLink_lineHeight: $tabNav_itemLink_height;
$tabNav_itemLink_padding: 0;
$tabNav_itemLink_background: transparent;
$tabNav_itemLink_color: #858C96;

// #inputText、#textarea 文本输入组件
$textField_width: 270px;
$textField_lineHeight: 22px;
$textField_padding: 12px 16px;
$textField_background: #FFF;
$textField_border: 1px solid $common_color_border;
$textField_borderRadius: 5px;

$inputText_height: $textField_lineHeight;

$textarea_height: $textField_lineHeight * 3;


// #frame 外层框架
$frame_base_width: 786px;
$frame_head_height: 46px;
$frame_head_background: #00A3E1;
$frame_head_title_fontSize: 18px;
$frame_nav_item_height: $frame_head_height;
$frame_nav_item_color: #ABE0F5;
$frame_nav_item_hover_color: #FFF;
$frame_nav_item_marginRight: 28px;
$frame_sidebar_width: 450px;
$frame_sidebar_widthSmall: 320px;
$frame_sidebar_background: #f7f7f7;
$frame_sidebar_inner_width: 240px;
$frame_sidebar_inner_widthSmall: 200px;
$frame_sidebar_inner_padding: 43px 22px 50px 0;
$frame_sidebar_nav_link_color: $tabNav_itemLink_color;
$frame_sidebar_nav_link_paddingLeft: 20px;
$frame_sidebar_nav_children_link_paddingLeft: 35px;

$frame_base_mobile_paddingHorizontal: 30px;
$frame_head_mobile_height: 50px;
$frame_head_mobile_btn_padding: 7px;

// #others 其它组件

// 图片路径
$images_path: "../images/independent/";
$sprite_path: "../images/";

// #column 栏目，用于展示组件及其介绍
$column_base_maxWidth: 840px;

// #index 首页
$index_banner_smallBtn_width: 166px;
$index_banner_startBtn_marginLeft: 15px;
$index_banner_startBtn_mobile_marginHorizontal: 5px;

$index_column_separator_spacingHorizontal: 283px;

$index_appIntro_img_dropShadow: 0 20px 20px #cfdce6;
$index_appIntro_img_width: 440px;
$index_appIntro_img_height: 640px;
$index_appIntro_img_mobile_width: 90%;

$index_banner_only_single_btn_screen_width: $index_banner_smallBtn_width * 2 + $index_banner_startBtn_mobile_marginHorizontal * 2 + $frame_base_mobile_paddingHorizontal * 2; // 宽度不足以横排 Banner 两个按钮时的屏幕宽度 = 两个 Banner 按钮的小宽度 + Banner 按钮的水平 margin（左右两个按钮各提供一个 margin）+ 最外层左右留白
